/**
 * Created by wlc on 2018/5/6.
 */
//mouseXY-args
var olderX;
var olderY;
//elementMove-args
var Element;
var ElementStatus;
var ElementoffsetLeft;
var ElementoffsetTop;
//toolsGenerate-args
var toolsGenerateStatus;
//neuronsInPanel-args
var neuronsStatus;

/**
 * 工具栏移动
 */
$(document).on("mousedown",'.tools-title', function(e){
    var evt=e||window.event;               //保证兼容性
    var tar=evt.target||evt.srcElement;  //获取触发事件的元素

    if (event.button===0){
        Element = tar.parentNode;
        ElementStatus = 1;
        ElementoffsetLeft = Element.offsetLeft;
        ElementoffsetTop = Element.offsetTop;
        olderX = e.clientX;
        olderY = e.clientY;
    }
});

/**
 * 模型工具栏-神经元模型产生
 */
$('#model-tools-neurons').mousedown(function (e) {
    var evt=e||window.event;               //保证兼容性
    var tar=evt.target||evt.srcElement;   //获取触发事件的元素
    if (evt.button===0){
        var model_tools = document.getElementById("model-tools");
        var model = $(NEURONS)[0];  //存储一个模型DOM
        model.id = (new Date()).valueOf();
        model.style.left = tar.style.left;
        model.style.top = tar.style.top+46;
        model_tools.appendChild(model);
        toolsGenerateStatus = 1;

        Element = model;
        ElementStatus = 1;
        ElementoffsetLeft = Element.offsetLeft;
        ElementoffsetTop = Element.offsetTop;
        olderX = e.clientX;
        olderY = e.clientY;
    }
});

/**
 * 模型面板-迷你状态移动
 */
$(document).on("mousedown",'.mini-panel', function(e){
    var evt=e||window.event;               //保证兼容性
    var tar=evt.target||evt.srcElement;  //获取触发事件的元素

    if (event.button===0){
        Element = $(tar).parents('.model-panel')[0];
        ElementStatus = 1;
        ElementoffsetLeft = Element.offsetLeft;
        ElementoffsetTop = Element.offsetTop;
        olderX = e.clientX;
        olderY = e.clientY;
    }
});

/**
 * 神经网络面板-神经元模型移动
 */
$(document).on("mousedown",'.neurons', function(e){
    var evt=e||window.event;               //保证兼容性
    var tar=evt.target||evt.srcElement;  //获取触发事件的元素

    if (event.button===0&&isSynapse!==1){
        Element = $(tar).parents('.neurons')[0];
        ElementStatus = 1;
        neuronsStatus = 1;
        ElementoffsetLeft = Element.offsetLeft;
        ElementoffsetTop = Element.offsetTop;
        olderX = e.clientX;
        olderY = e.clientY;
        SynapseArrA = $('.'+tar.parentNode.parentNode.id + "-A");
        SynapseArrB = $('.'+tar.parentNode.parentNode.id + "-B");
    }
});

/**
 * 通用
 * @param e
 */
document.onmousedown = function (e) {
    var evt=e||window.event;               //保证兼容性
    var tar=evt.target||evt.srcElement;  //获取触发事件的元素

    //突触连接
    if (event.button===0&&isSynapse===1&&tar.parentNode.parentNode.id===beginSynapse){
        var panel3DSpace = $(tar).parents('.panel-NN-3D')[0];
        if (tar.className.indexOf("neurons-input") !== -1){
            SynapseCanvas = $('<canvas></canvas>')[0];
            panel3DSpace.appendChild(SynapseCanvas);
            SynapseContext=SynapseCanvas.getContext('2d');
            SynapseStatus = 1;
            SynapseCanvas.id = beginSynapse + "-A";
            SynapseCanvas.className = beginSynapse + "-A";
            beginSynapsePoint = "A";
            beginSynapseX = e.clientX;
            beginSynapseY = e.clientY;

            SynapseCanvas.style.left = e.clientX -getLeft(panel3DSpace);
            SynapseCanvas.style.top = e.clientY - getTop(panel3DSpace);
            SynapseCanvas.width = "0";
            SynapseCanvas.height = "0";
        }else if (tar.className.indexOf("neurons-output") !== -1){
            SynapseCanvas = $('<canvas></canvas>')[0];
            panel3DSpace.appendChild(SynapseCanvas);
            SynapseContext=SynapseCanvas.getContext('2d');
            SynapseStatus = 1;
            SynapseCanvas.id = beginSynapse + "-B";
            SynapseCanvas.className = beginSynapse + "-B";
            beginSynapsePoint = "B";
            beginSynapseX = e.clientX;
            beginSynapseY = e.clientY;

            SynapseCanvas.style.left = e.clientX -getLeft(panel3DSpace);
            SynapseCanvas.style.top = e.clientY - getTop(panel3DSpace);
            SynapseCanvas.width = "0";
            SynapseCanvas.height = "0";
        }
    }
};

document.onmousemove = function (e) {
    var evt=e||window.event;               //保证兼容性
    var tar=evt.target||evt.srcElement;  //获取触发事件的元素

    //元素移动
    if (ElementStatus === 1){
        var dX = e.clientX - olderX;
        var dY = e.clientY - olderY;
        Element.style.left = (ElementoffsetLeft + dX) + "px";
        Element.style.top = (ElementoffsetTop + dY) + "px";
    }
    //突触连接
    else if (SynapseStatus === 1){
        var activePanel3DSpace = $('.normal-panel')[0].children[0];
        SynapseCanvas.width = Math.abs(e.clientX - beginSynapseX).toString();
        SynapseCanvas.height = Math.abs(e.clientY - beginSynapseY).toString();
        //重绘
        if (e.clientX - beginSynapseX < 0){
            if (e.clientY - beginSynapseY < 0){  //左上移动
                SynapseCanvas.style.left = e.clientX -getLeft(activePanel3DSpace);
                SynapseCanvas.style.top = e.clientY - getTop(activePanel3DSpace);
                SynapseContext.moveTo(SynapseCanvas.width,SynapseCanvas.height);
                SynapseContext.lineTo(0,0);
            }else {                     //左下移动
                SynapseCanvas.style.left = e.clientX -getLeft($(activePanel3DSpace)[0]);
                SynapseContext.moveTo(SynapseCanvas.width,0);
                SynapseContext.lineTo(0,SynapseCanvas.height);
            }
        }else {           //右上移动
            if (e.clientY - beginSynapseY < 0){
                SynapseCanvas.style.top = e.clientY - getTop($(activePanel3DSpace)[0]);
                SynapseContext.moveTo(0,SynapseCanvas.height);
                SynapseContext.lineTo(SynapseCanvas.width,0);
            }else {
                SynapseContext.moveTo(0,0);
                SynapseContext.lineTo(SynapseCanvas.width,SynapseCanvas.height);
            }
        }
        //设置cursor
        if(tar.parentNode.parentNode.id!==beginSynapse&&(tar.className==="neurons-input"||tar.className==="neurons-output")){
            activePanel3DSpace.style.cursor = "crosshair";
        }else{
            activePanel3DSpace.style.cursor = "";
        }
        SynapseContext.strokeStyle = "#66CCF3";
        SynapseContext.lineWidth = 2;
        SynapseContext.stroke();
    }
    //神经元模型移动期间使突触随神经元移动
    if(ElementStatus===1&&neuronsStatus===1&&tar.parentNode.parentNode.className==="neurons model-object"){
        var activePanel3DSpace = $('.normal-panel')[0].children[0];
        var canvas;
        var ctx;
        var selfE;
        var targetN;
        var targetE;
        //神经元输出端突触跟随
        for (var i = 0; i < SynapseArrB.length;i++){
            canvas = SynapseArrB[i];
            ctx = canvas.getContext('2d');
            selfE = tar.parentNode.parentNode.children[0].children[1];
            targetN = $('#'+SynapseArrB[i].className.replace(tar.parentNode.parentNode.id+"-B","").replace(" ","").split("-")[0])[0];
            targetE = SynapseArrB[i].className.replace(tar.parentNode.parentNode.id+"-B","").replace(" ","").split("-")[1]==="A"?targetN.children[0].children[0]:targetN.children[0].children[1];
            canvas.width = Math.abs(getLeft(targetE)-getLeft(selfE));
            canvas.height = Math.abs(getTop(targetE)-getTop(selfE));
            if (getLeft(targetE)-getLeft(selfE)>0){
                if (getTop(targetE)-getTop(selfE)<0){   //右上
                    canvas.style.top = getTop(targetE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(selfE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(0,canvas.height);
                    ctx.lineTo(canvas.width,0);
                }else {                //右下
                    canvas.style.top = getTop(selfE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(selfE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(0,0);
                    ctx.lineTo(canvas.width,canvas.height);
                }
            }else {
                if (getTop(targetE)-getTop(selfE)<0){   //左上
                    canvas.style.top = getTop(targetE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(targetE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(canvas.width,canvas.height);
                    ctx.lineTo(0,0);
                }else {                //左下
                    canvas.style.top = getTop(selfE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(targetE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(canvas.width,0);
                    ctx.lineTo(0,canvas.height);
                }
            }
            ctx.strokeStyle = "#66CCF3";
            ctx.lineWidth = 2;
            ctx.stroke();
        }
        //神经元输入端突触跟随
        for (var i = 0; i < SynapseArrA.length;i++){
            canvas = SynapseArrA[i];
            ctx = canvas.getContext('2d');
            selfE = tar.parentNode.parentNode.children[0].children[0];
            targetN = $('#'+SynapseArrA[i].className.replace(tar.parentNode.parentNode.id+"-A","").replace(" ","").split("-")[0])[0];
            targetE = SynapseArrA[i].className.replace(tar.parentNode.parentNode.id+"-A","").replace(" ","").split("-")[1]==="A"?targetN.children[0].children[0]:targetN.children[0].children[1];
            canvas.width = Math.abs(getLeft(targetE)-getLeft(selfE));
            canvas.height = Math.abs(getTop(targetE)-getTop(selfE));
            if (getLeft(targetE)-getLeft(selfE)>0){
                if (getTop(targetE)-getTop(selfE)<0){   //右上
                    canvas.style.top = getTop(targetE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(selfE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(0,canvas.height);
                    ctx.lineTo(canvas.width,0);
                }else {                //右下
                    canvas.style.top = getTop(selfE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(selfE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(0,0);
                    ctx.lineTo(canvas.width,canvas.height);
                }
            }else {
                if (getTop(targetE)-getTop(selfE)<0){   //左上
                    canvas.style.top = getTop(targetE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(targetE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(canvas.width,canvas.height);
                    ctx.lineTo(0,0);
                }else {                //左下
                    canvas.style.top = getTop(selfE)-getTop(activePanel3DSpace);
                    canvas.style.left = getLeft(targetE)-getLeft(activePanel3DSpace);
                    ctx.moveTo(canvas.width,0);
                    ctx.lineTo(0,canvas.height);
                }
            }
            ctx.strokeStyle = "#66CCF3";
            ctx.lineWidth = 2;
            ctx.stroke();
        }
    }
};

document.onmouseup = function (e) {
    var evt=e||window.event;               //保证兼容性
    var tar=evt.target||evt.srcElement;   //获取触发事件的元素
    var NeuralNetworksName = $('#config-title')[0].children[0].innerText;

    ElementStatus = 0;  //移动状态
    neuronsStatus = 0;  //神经元移动状态
    //模型产生-面板放置
    if (toolsGenerateStatus === 1){
        //tools
        var toolsTop = Element.parentNode.offsetTop;
        var toolsLeft = Element.parentNode.offsetLeft;
        var toolsWidth = Element.parentNode.offsetWidth;
        var toolsHeigh = Element.parentNode.offsetHeight;
        //panel
        var activePanel = $('.normal-panel')[0];
        var panelTop = activePanel.offsetTop;
        var panelLeft = activePanel.offsetLeft;
        var panelWidth = activePanel.offsetWidth;
        var panelHeigh = activePanel.offsetHeight;
        if (Element.offsetLeft>0&&(Element.offsetLeft+Element.offsetWidth)<toolsWidth&&Element.offsetTop>0&&(Element.offsetTop+Element.offsetHeight)<toolsHeigh){
            Element.remove();
        }else if ((Element.offsetLeft+toolsLeft)>panelLeft&&(Element.offsetLeft+toolsLeft+Element.offsetWidth)<(panelLeft+panelWidth)&&(Element.offsetTop+toolsTop)>panelTop&&(Element.offsetTop+toolsTop+Element.offsetHeight)<(panelTop+panelHeigh)){
            Element.style.left = getLeft(Element) - panelLeft + "px";
            Element.style.top = getTop(Element) - panelTop + "px";
            activePanel.children[0].appendChild(Element);

            $.ajax({
                type: 'POST',
                url: '../NeuralNetworks/NeuronsAdd' ,
                data: {NeuralNetworksName:NeuralNetworksName,neuronsId:Element.id}
            });
        }else {
            Element.remove();
        }
        toolsGenerateStatus = 0;
    }
    //突触连接
    else if(SynapseStatus === 1){
        var activePanel3DSpace = $('.normal-panel')[0].children[0];
        if (tar.className==="neurons-input" && tar.parentNode.parentNode.id !== beginSynapse){
            SynapseCanvas.id = SynapseCanvas.id + "-" + tar.parentNode.parentNode.id + "-A";
            SynapseCanvas.className = SynapseCanvas.className + " " + tar.parentNode.parentNode.id + "-A";
            $.ajax({
                type: 'POST',
                url: '../NeuralNetworks/SynapseAdd' ,
                data: {NeuralNetworksName:NeuralNetworksName,synapseId:SynapseCanvas.id}
            });
        }else if(tar.className==="neurons-output" && tar.parentNode.parentNode.id !== beginSynapse){
            SynapseCanvas.id = SynapseCanvas.id + "-" + tar.parentNode.parentNode.id + "-B";
            SynapseCanvas.className = SynapseCanvas.className + " " + tar.parentNode.parentNode.id + "-B";
            $.ajax({
                type: 'POST',
                url: '../NeuralNetworks/SynapseAdd' ,
                data: {NeuralNetworksName:NeuralNetworksName,synapseId:SynapseCanvas.id}
            });
        } else {
            SynapseCanvas.remove();
        }
        activePanel3DSpace.style.cursor = "";
        SynapseStatus = 0;
        isSynapse = 0;
    }
};